<template>
  <div class="app">
    <div class="box">
      <div class="boxone">
        <el-input v-model="input" placeholder="请输入" clearable />
        <el-button type="primary" @click="chaxun">查询</el-button>
        <el-button @click="kong()">重置</el-button>
      </div>
    </div>
    <div class="aa">
      <el-button type="primary" @click="acc()">发布提醒</el-button>
    </div>
    <div class="boxtwo">
      <el-table :data="tableData" border style="width: 100%" stripe="ture">
        <el-table-column     prop="id" align="center" label="序号" width="70" />
        <el-table-column
          prop="student.name"
          align="center"
          label="学生姓名"
          width="100"
        />
        <el-table-column
          prop="classId"
          width="100"
          align="center"
          label="年级班级"
        />
        <el-table-column
          prop="title"
          width="230"
          align="center"
          label="带药提醒"
        />
        <el-table-column
          prop="time"
          width="200"
          align="center"
          label="用药日期"
        />
        <el-table-column
          prop="student.name"
          width="100"
          align="center"
          label="发送者"
        />
        <el-table-column
          prop="time"
          width="200"
          align="center"
          label="发送时间"
        />
        <el-table-column
          prop="teacher.name"
          width="100"
          align="center"
          label="接收人"
        />
        <el-table-column prop="id" width="100" align="center" label="操作">
          <template #default="scope">
            <span @click="deletes(scope.row)" style="color: red"> 删除 </span>
          </template>
        </el-table-column>
      </el-table>
      <div class="boxstree">
        <el-pagination
          small
          background
          layout="prev, pager, next"
          :total="50"
          class="mt-4"
            @prev-click="prev-click"
      @next-click="next-click"
        />
      </div>
    </div>
  </div>
</template>

<script setup>
import server from "@/api/index.ts";
import { onMounted, reactive, ref } from "vue";
import { useRouter } from "vue-router";
var input = ref("");
var tableData = ref([]);
var sda = ref();
onMounted(async () => {
  var res = await server.jiaxiaohutong.link({ cp: 1, ps: 5 });
  // console.log(res.data.data.date);
  tableData.value = res.data.data.date;
  console.log(tableData);
});

const deletes = async (row) => {
  console.log(row.id);
 var res = await server.jiaxiaohutong.deleteAllInform(row.id)
 if (res.data.code == 200) {
 var i = tableData.value.findIndex(item => item.id == row.id)
 tableData.value.splice(i, 1)
}
}
  // 输入框
var input = ref();
var kong=()=>{
  input.value=''
}
//查询
var chaxun=async()=>{
var num=input.value
console.log(num);
    var res=await server.juxiaohutong. getAllInformById(num) 
  console.log(res);
 if (res.data.code == 200) {
     ElNotification.success({ message: '查看成功' })
  }
 
}
// 分页.
// var prev-click=()=>{

// }

//获取路由管理实例
var router = useRouter();
var acc = () => {
  router.push("/index/jiaxiaohudong/jiankangone");
};


</script>

<style scoped>
.app {
  /* background-color: #e2e2e2; */
  width: 100%;
}
p {
  width: 135px;
}
.box {
  margin-top: 5px;
  width: 100%;
  height: 60px;
}
.boxone {
  display: flex;
  width: 45%;

  margin-left: 50%;
}
.boxtwo {
  margin-top: 10px;
  width: 1200px;
  background-color: #fff;
  margin: 0 auto;
  text-align: center;
}
.boxtwo > .el-button {
  margin: 10px 0;
  margin-left: 92%;
}
.boxstree {
  margin-left: 80%;
  margin-top: 20px;
  height: 35px;
}

.aa {
  display: block;
  width: 98%;
  height: 50px;
}
.aa .el-button {
  float: right;
}
</style>